@layout('layouts.clearly')

<?php

?>

@section('content')
@id('house.index')
<?php
if (!isset($search)) {
    $p_title = 'Xem nhà trọ';
} else {
    $p_title = 'Kết quả tìm kiếm';
}

$title = $p_title . ' | Trang ' . $current_page;
?>
<div class="page-head">
    <h1>{{ $p_title }}</h1>
</div>


<div class="container" id="houses-index">
    <div id="home-houses-list" class="w640 fl-left">
        <ul class="no-style" id="houses-list">
            @forelse ($houses as $house)
            <li class="clear-fix item">
                <div class="info fl-left">
                    <a class="thumb dis-block fl-left" href="{{ $house->url }}">
                        <img src="{{ $house->random_image }}" alt="Nha tro thumb" />
                    </a>

                    <div class="intro">
                        <a class="dis-block house-name" href="{{ $house->url }}">{{ $house->name }}</a>
                        <p class="describe">{{ $house->intro }}</p>
                        <p class="address">{{ $house->address }}</p>
                    </div>
                </div>
                <ul class="meta no-style fl-right">
                    <li>
                        <span class="label">Diện tích</span>
                        <span class="value">{{ $house->room_area_statistic }}</span>
                    </li>
                    <li>
                        <span class="label">Phòng trống</span>
                        <span class="value">{{ $house->room_calc('blank', 'count') }}</span>
                    </li>
                    <li>
                        <span class="label">Giá phòng</span>
                        <span class="value">{{ $house->room_price_statistic }}</span>
                    </li>
                    <li>
                        <span class="label">Tiện nghi</span>
                        <span class="value" title="{{ $house->facilities() }}">
                            {{ Str::words($house->facilities(), 4) }}

                        </span>
                    </li>
                </ul>
            </li>
            @empty
            <div class="error">Không có nhà trọ thỏa điều kiện hiện tại</div>
            @endforelse
        </ul><!-- houses list -->

        {{ $pagination }}
</div>


    <div class="w-300 fl-right" id="houses-sidebar">
        <form action="{{ action('house@search') }}" method="GET" id="search-form" class="w300">
            <fieldset>
                <legend>Tìm kiếm nhà trọ</legend>
                <div class="hint">
                    Tìm kiếm nhà trọ theo các điều kiện bên dưới, bạn có thể bỏ qua bất kỳ trường nào nếu không muốn chỉ định
                </div>

                <div class="control-group">
                    <label for="house_name">Tên nhà trọ</label>
                    <div class="controls">
                        <input type="text" class="w-full" name="ten-nha-tro" id="house_name" />
                    </div>
                </div>

                <div class="control-group">
                    <label for="city">Tỉnh/thành phố</label>
                    <div class="controls">
                        <select name="thanh-pho" id="city" class="select-box">
                            <option value="-1">Không</option>
                            @foreach (City::items() as $city)
                            <option value="{{ $city->id }}">{{ $city->city_name }}</option>
                            @endforeach
                        </select>
                    </div>
                </div>

                <div class="control-group">
                    <label for="district">Quận/huyện</label>
                    <div class="controls">
                        <select name="quan" id="district" class="select-box">
                            <option value="-1" selected="true">Không</option>
                            @foreach (City::first()->districts as $d)
                            <option value="{{ $d->id }}">{{ $d->district_name }}</option>
                            @endforeach
                        </select>
                    </div>
                </div>

                <div class="control-group">
                    <label for="ward">Phường/xã</label>
                    <div class="controls">
                        <select name="phuong" id="ward" class="select-box">
                            <option value="-1">Không</option>
                        </select>
                    </div>
                </div>

                <div class="control-group">
                    <label for="max_price">Giá tối đa</label>
                    <div class="control">
                        <input type="text" class="w-full" name="gia-cao-nhat">
                    </div>
                </div>

                <div class="control-group">
                    <label>Yêu cầu khác</label>
                    <div class="controls">
                        <div class="control-column w130 fl-left">
                            <label for="internet">
                                <input type="checkbox" name="internet" id="internet" checked="true" value="1"/> Internet
                            </label>

                            <label for="garret">
                                <input type="checkbox" name="gac" id="garret" value="1"> Có gác
                            </label>
                        </div>

                        <div class="control-column">
                            <label for="tv">
                                <input type="checkbox" name="tv" id="tv" value="1"> Tivi
                            </label>
                            <label for="air_condition">
                                <input type="checkbox" name="dieu-hoa" id="air_condition" value="1"> Điều hòa
                            </label>
                        </div>
                    </div>
                </div>

                <div class="control-group">
                    <div class="controls ta-right">
                        <button class="btn" type="submit">
                            <i class="icon-search"></i>
                            Tìm kiếm
                        </button>
                    </div>
                </div>
            </fieldset>
        </form>
    </div>
</div>
@endsection